﻿<cms-page-header cms-title="{{vm.document.title}}"
                 cms-parent-title="Documents"></cms-page-header>

<cms-form cms-name="mainForm"
          cms-edit-mode="vm.editMode"
          ng-submit="vm.save()"
          cms-loading="vm.formLoadState.isLoading">

    <!-- Default toolbar -->
    <cms-page-actions ng-show="!vm.editMode">

        <cms-button class="main-cta" cms-text="Edit"
                    ng-if="::vm.canUpdate"
                    ng-click="vm.edit()"
                    ng-show="!vm.editMode"
                    ng-disabled="vm.globalLoadState.isLoading"></cms-button>

        <cms-button cms-text="Delete"
                    ng-if="::vm.canDelete"
                    ng-click="vm.remove()"
                    ng-disabled="vm.editMode || vm.globalLoadState.isLoading"></cms-button>

    </cms-page-actions>

    <!-- Edit mode toolbar -->
    <cms-page-actions ng-show="vm.editMode">

        <cms-button-submit class="main-cta" cms-text="Save"
                           ng-show="vm.editMode"
                           ng-disabled="vm.mainForm.$invalid || vm.globalLoadState.isLoading"
                           cms-loading="vm.saveLoadState.isLoading"></cms-button-submit>

        <cms-button cms-text="Cancel"
                    ng-click="vm.cancel()"
                    ng-show="vm.editMode"
                    ng-disabled="vm.globalLoadState.isLoading"></cms-button>

    </cms-page-actions>

    <cms-page-body cms-content-type="form">

        <cms-form-status></cms-form-status>

        <!--MAIN-->
        <cms-form-section cms-title="Main">

            <cms-form-field-document-upload cms-title="File"
                                            cms-model="vm.command.file"
                                            cms-load-state="vm.saveLoadState"
                                            cms-asset="vm.previewDocument"
                                            required></cms-form-field-document-upload>

            <cms-form-field-text cms-title="Title"
                                 cms-model="vm.command.title"
                                 cms-description="A short descriptive title e.g. 'Today's Menu' or 'Directions to our office'."
                                 max-length="130"
                                 required></cms-form-field-text>

            <cms-form-field-text-area cms-title="Description"
                                      cms-model="vm.command.description"></cms-form-field-text-area>
            
            <cms-form-field-readonly cms-title="Path"
                                     cms-description="Full path to the document file."
                                     cms-model="vm.document.url"></cms-form-field-readonly>

            <cms-form-field-tags cms-title="CMS Tags"
                                 cms-model="vm.command.tags"></cms-form-field-tags>

        </cms-form-section>

        <!--AUDIT DATA-->
        <cms-form-section-audit-data cms-audit-data="vm.document.auditData"></cms-form-section-audit-data>

    </cms-page-body>

</cms-form>